<template>
    <div class="hepatitisDetail">
       <div class="top">
        <span class="vaccine">乙肝疫苗</span><span class="must">必打</span>
       </div>
       <div class="content">
           <div class="title">
            <p class="jin">接种时间</p>
            <p class="desc">乙肝疫苗全程接种共3针，宝宝出生后的24小时内注射
             第一针，宝宝1个月大时注射第二针，宝宝6个月大时
             注射第3针</p>
            
           </div>
           <div class="title1">
             <p class="jin1">接种原因</p>
             <p class="desc">有很多乙肝病毒携带者都是在新生儿或儿童时期就受
                到了感染.刚出生的宝宝免疫功能尚不健全，对乙肝
                病毒的免疫力极低，一旦受到感染便很难清除病毒
                最终成为乙肝病毒的携带者.因此新生儿的乙肝预防
                非常重要，所有宝宝都应当接种乙肝疫苗</p>
           </div>
           <div class="title2">
             <p class="jin2">接种原理</p>
             <p class="desc">乙肝疫苗通过制备乙肝病毒表面的某些有效蛋白，并
            将这些蛋白接种到人体，使人体内的免疫细胞产生可
            对抗该病毒的抗体，从而达到预防乙肝疾病的目的.
            而被接种者本身并不会受到感染.接种疫苗后，当人
            体再次接触到乙肝病毒时，其已存在于体内的抗体就
            会立即开始工作，清除病毒，抵御感染</p>
           </div>
           </div>
       </div>

    
   
</template>

<script setup lang="ts">

</script>

<style scoped lang="scss">
 .hepatitisDetail{
    width: 100%;
    height: 100%;
    background: #f6f8f9;
    .top{
        width: 100%;
        height: 70px;
        background: #fff;

        .vaccine{
          line-height: 70px;
          margin-left: 20px;
          color: #f48d9e;
          font-size: 18px;
        }
        .must{
            margin-left: 10px;
            display: inline-block;
            width: 40px;
            font-size: 13px;
            height: 18px;
            background: #f48d9e;
            text-align: center;
            color: #fff;
            border: 10px;
        }
    }
    .content{
    width: 96%;
    margin-left: 10px;
    background: #fff;
    margin-top: 10px;
   
     .title{
        width: 100%;
        height: 135px;
        border-bottom: 1px solid #ccc;
       
         
        .jin{
            margin-top: 10px;
          
            height: 30px;
            line-height: 40px;
        }
         .desc{
            color:#878787;
        }
       p{
        height: 30px;
         margin-top: 10px;
         line-height: 25px;
       }
        
     }
      .title1{
        width: 100%;
        height: 200px;
        border-bottom: 1px solid #ccc;
    
        .jin1{
            margin-top: 10px;
          
            height: 30px;
            line-height: 40px;
        }
         .desc{
            color:#878787;
        }
       p{
        height: 30px;
         margin-top: 10px;
         line-height: 25px;
       }
        
     }
      .title2{
        width: 100%;
        height: 300px;
      
      
        .jin2{
            margin-top: 10px;
          
            height: 30px;
            line-height: 40px;
        }
         .desc{
            color:#878787;
        }
       p{
        height: 30px;
         margin-top: 10px;
         line-height: 25px;
       }
        
     }
    }
 }
</style>